Box Model
→盒模型
CSS
https://i.imgur.com/WG75USi.jpghttps://i.imgur.com/UQ5tRfs.png
由外到內：
Margin
容器外部（例如與其它容器之間）的留空距離
此空間是透明的
Margin Collapsing
Border
將內容與 Padding 包圍住的外框
Padding
從容器到內容部份的留空距離
此空間是透明的
Content
容器內如文字、圖片等元素的內容部份
1. height：高度
2. width：寬度
stretch
CSSのwidth: 100%;のより良い代替手段として、stretchキーワードが実はかなり便利です | コリス
3. padding：內間隔
4. margin：外間隔
padding和margin的值設為auto時，值等同母元素的長寬度 - 當前元素的長寬度
box-sizing
詳細的內距與邊框數值計算準則
border-box
元素所設定的長寬（height、width）為最終顯示結果
內距、邊框都會向內計算
content-box
目前的瀏覽器預設值
元素中的長寬和內距、邊框、外距皆獨立計算
2019-07-03 フロントエンドのプロ直伝！CSS 余白設定の三原則 ( ＋線の引き方 )
2019-09-04 30 道難解的 CSS 排版 第 1 道：認識對齊 I
display(CSS)
overflow(CSS)
position(CSS)
vertical-align(CSS)
尺寸單位(CSS)
置中(CSS)